<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org"
      xmlns:shiro="http://www.pollix.at/thymeleaf/shiro">
<head th:include="include :: header"></head>
<body class="hold-transition skin-blue sidebar-mini">

<!--选择模态框-->
<div class="modal fade" id="modal-select">
    <div class="modal-dialog" style="width: 1350px;">
        <div class="modal-content">
            <div class="modal-header" style="padding-bottom: 0px;">
                <button type="button" class="close" data-dismiss="modal" aria-label="Close">
                    <span aria-hidden="true">&times;</span></button>
                <h4 class="modal-title">制作件在库信息</h4>
            </div>
            <div class="modal-body" style="padding-bottom: 5px;padding-top: 0px;">
                <div class="row">
                    <div class="col-xs-12">
                        <div class="box">
                            <form id="queryForm">
                                <div class="box-header" style="padding-bottom: 0px;">
                                    <div class="row" id="HiddenDiv">
                                        <div class="form-inline">
                                            <div class="form-group">
                                                <label>
                                                    物料分类
                                                </label>
                                                <select id="ityMatTypeQuery" name="ityMatTypeQuery"
                                                        class="form-control">
                                                    <option value="3">制作件</option>
                                                </select>
                                            </div>
                                            <div class="form-group">
                                                <label>
                                                    物料描述
                                                </label>
                                                <input type="text" id="ityMatNameQuery" name="ityMatNameQuery"
                                                       class="form-control" placeholder="请输入物料描述">
                                            </div>
                                            <div class="form-group">
                                                <label>图号</label>
                                                <input type="text" id="ityDrawingCodeQuery" name="ityDrawingCodeQuery"
                                                       class="form-control" placeholder="请输入图号">
                                            </div>
                                            <div class="form-group" >
                                                <label>项目名称</label>
                                                <input type="text" id="ityProNameQuery" name="ityProNameQuery"
                                                       class="form-control" placeholder="请输入项目名称或部分名称">
                                            </div>
                                            <div class="form-group">
                                                <label>项目编号</label>
                                                <input type="text" id="ityProCodeQuery" name="ityProCodeQuery"
                                                       class="form-control"
                                                       placeholder="请输入项目编号">
                                            </div>
                                            <div class="form-group">
                                                <label>存放状态</label>
                                                <select id="ityMakingPiecesStatusQuery" class="form-control"
                                                        name="ityMakingPiecesStatusQuery">
                                                    <option value="">全部</option>
                                                    <option value="待机加">待机加</option>
                                                    <option value="待外协">待外协</option>
                                                    <option value="待装配">待装配</option>
                                                    <option value="待发货">待发货</option>
                                                </select>
                                            </div>
                                            <div class="form-group">
                                                <button class="btn btn-success" type="button" id="btn_stockSearch">搜索</button>
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </form>
                            <div class="box-body" style="padding-top: 0px;padding-bottom: 0px;">
                                <table id="bootstrap-table"></table>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
            <div class="modal-footer" style="padding-top: 5px;">
                <button type="button" class="btn btn-info" id="btn-commit">确定</button>
                <button type="button" class="btn btn-default" data-dismiss="modal">取消</button>
            </div>
        </div>
    </div>

</div>


<section class="content-header">
    <h1>
        制作件出库单
    </h1>
</section>
<section class="content">

    <div id="printArea" style=" display: none;">
        <div style="padding-bottom: 10px;text-align: center;vertical-align: middle;">
            <div style="font-size: 20px;vertical-align: middle;display: inline-block;font-weight: bold;">辽宁忠旺机械设备制造有限公司出库单
            </div>
        </div>
        <table style="font-size:12px;width: 100%;line-height: 20px;">
            <tr>
                <td width="25%">单据编号：<label id="odrCodePrint" style="font-weight: normal"></label></td>
                <td width="20%">出库类型：<label id="odrOutTypePrint" style="font-weight: normal"></label></td>
                <td width="25%">出库车间：<label id="odrDeptPrint" style="font-weight: normal"></label></td>
                <td width="30%">经手人：<label id="odrCheckerPrint" style="font-weight: normal"></label></td>
            </tr>
            <tr>
                <td colspan="2">联系方式：<label id="odrServicePersonPrint" style="font-weight: normal"></label></td>
                <td>说明：<label id="odrSummaryPrint" style="font-weight: normal"></label></td>
                <td>制单人：<label id="odrTakePersonPrint" style="font-weight: normal"></label></td>
            </tr>
        </table>
        <div id="table-box">
        </div>
    </div>

    <form id="inbillForm" class="form-inline" role="form"
          enctype="multipart/form-data">
        <input type="hidden" id="odrId" th:value="${order.odrId}">
        <div class="row">
            <div class="col-xs-12">
                <div class="box">
                    <div class="box-body">
                        <div class="row">

                            <div class="form-group">
                                <label>单据编号</label>
                                <input type="text" class="form-control" name="odrCode" th:value="${order.odrCode}"
                                       readonly="readonly"/>
                            </div>

                            <div class="form-group">
                                <label>出库类型</label>
                                <select id="odrOutType" class="form-control" name="odrOutType" disabled="disabled">
                                    <option value="" th:selected="${order.odrOutType == null}">请选择</option>
                                    <option value="4" th:selected="${order.odrOutType == 4}">领料出库</option>
                                    <option value="7" th:selected="${order.odrOutType == 7}">发货出库</option>
                                </select>
                            </div>
                            <div class="form-group">
                                <label>出库车间</label>
                                <select id="odrDept" class="form-control select2" name="odrDept"
                                         disabled>
                                    <option value="">请选择</option>
                                    <option th:each="type:${dept}" th:value="${type.depId}"
                                            th:text="${type.depName}"
                                            th:selected="${order.odrDept == type.depId}"></option>
                                </select>
                            </div>

                            <div class="form-group">
                                <label>经手人</label>
                                <input id="odrChecker" type="text" class="form-control" name="odrChecker"
                                       th:value="${order.odrChecker}" readonly="readonly"/>
                            </div>

                            <div class="form-group">
                                <label>联系方式</label>
                                <input id="odrServicePerson" type="text" class="form-control" name="odrServicePerson"
                                       placeholder=""
                                       th:value="${order.odrServicePerson}" readonly="readonly"/>
                            </div>
                        </div>
                        <div class="form-group">
                            <label>说明</label>
                            <input id="odrSummary" type="text" class="form-control" name="odrSummary" placeholder=""
                                   th:value="${order.odrSummary}" readonly="readonly"/>
                        </div>
                    </div>
                    <div class="row">
                        <div id="hot"></div>
                    </div>
                </div>
                <div class="box-footer">
                    <div class="row">
                        <div class="col-md-2">
                            <label>制单人：</label><label th:text="${order.odrTakePerson}"></label>
                        </div>
                        <div class="col-md-6">
                            <label></label>
                        </div>
                        <div class="col-md-4">
                            <div class="col-md-2 col-md-offset-6">
                                <button type="button" onclick="printBtn()" class="btn btn-info file-contract btn-file">打印</button>
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
        </div>
    </form>
</section>
<div th:include="include :: footer"></div>
<script th:src="@{/js/jquery.PrintArea.js}"></script>
<script th:inline="javascript">

    var table;

    function printBtn(){
        var odrId = $("#odrId").val();
        js.post({
            url: ctx + "half/halWarManage/outOfFinishWar/printList",
            data: {id: odrId},
            contentType: "application/x-www-form-urlencoded",
            success: function (data) {
                $("#odrCodePrint").text(data.data["odrCode"]);
                $("#odrOutTypePrint").text(data.data["odrOutType"] == 4 ? "领料出库" : "发货出库");
                $("#odrDeptPrint").text(data.data["odrDeptName"]);
                $("#odrCheckerPrint").text(data.data["odrChecker"]);
                $("#odrSummaryPrint").text(data.data["odrSummary"]);
                $("#odrTakePersonPrint").text(data.data["odrTakePerson"]);
                $("#odrServicePersonPrint").text(data.data["odrServicePerson"]);

                // 绑定打印明细数据
                printInBillDetail(odrId);
            }
        });
    }

    // 绑定打印明细数据
    function printInBillDetail(id) {

        $("#printArea").show();
        js.post({
            url: ctx + "half/halWarManage/outOfFinishWar/printDetailList",
            data: {
                id: id
            },
            contentType: "application/x-www-form-urlencoded",
            success: function (data) {
                var printList = data.data;
                // 添加dataTable表头
                $("#table-box").empty();
                $("#table-box").append('<table id="inBillTable"\n' +
                    '               style="font-size: 12px;text-align: center;border-right:1px solid;border-bottom:1px solid; border-collapse: collapse;"\n' +
                    '               width="100%"\n' +
                    '               cellspacing="0" cellpadding="1">\n' +
                    '        </table>');
                $("#inBillTable").append('<THEAD style="display:table-header-group;">\n' +
                    '<TR><td style="border-left: 1px solid;border-top: 1px solid;">序号</td>' +
                    '<td style="border-left: 1px solid;border-top: 1px solid;">物料描述</td>' +
                    '<td style="border-left: 1px solid;border-top: 1px solid;">图号</td>' +
                    '<td style="border-left: 1px solid;border-top: 1px solid;">数量</td>' +
                    '<td style="border-left: 1px solid;border-top: 1px solid;">单位</td>' +
                    '<td style="border-left: 1px solid;border-top: 1px solid;">项目编号</td>' +
                    '<td style="border-left: 1px solid;border-top: 1px solid;">项目名称</td>' +
                    '<td style="border-left: 1px solid;border-top: 1px solid;">部分名称</td>' +
                    '<td style="border-left: 1px solid;border-top: 1px solid;">合同编号</td>' +
                    '<td style="border-left: 1px solid;border-top: 1px solid;">是否成品</td>' +
                    '<td style="border-left: 1px solid;border-top: 1px solid;">存放状态</td>' +
                    '<td style="border-left: 1px solid;border-top: 1px solid;">箱号</td>' +
                    '<td style="border-left: 1px solid;border-top: 1px solid;">装箱日期</td>' +
                    //'<td style="border-left: 1px solid;border-top: 1px solid;">仓库</td>' +
                    '<td style="border-left: 1px solid;border-top: 1px solid;">区位</td>' +
                    '<td style="border-left: 1px solid;border-top: 1px solid;">出库日期</td>' +
                    '<td style="border-left: 1px solid;border-top: 1px solid;">备注</td></TR>\n ' +
                    '</THEAD> ');
                $("#inBillTable").append('<tbody id="myTb"> </tbody>');
                // 循环绑定dataTable行数据
                var rowIndex;
                var odaMatNamePrint;
                var odaDrawingCodePrint;
                var odaNumPrint;
                var odaUnitPrint;
                var odaProCodePrint;
                var odaProNamePrint;
                var odaPartPrint;
                var contractNoPrint;
                var odaIfFinishedProductPrint;
                var odaMakingPiecesStatusPrint;
                var odaCaseNoPrint;
                var odaBoxingDatePrint;
                var odaWhiIdName;
                var odaPositionPrint;
                var odaStorageDatePrint;
                var odaRemarkPrint;

                var newRow;

                for (var i = 0; i < printList.length; i++) {
                    rowIndex = printList[i]["rowIndex"];
                    odaMatNamePrint = printList[i]["odaMatName"];
                    odaDrawingCodePrint = printList[i]["odaDrawingCode"] == null?"":printList[i]["odaDrawingCode"];
                    odaNumPrint = printList[i]["odaNum"];
                    odaUnitPrint = printList[i]["odaUnit"];
                    odaProCodePrint = printList[i]["odaProCode"] == null?"":printList[i]["odaProCode"];
                    odaProNamePrint = printList[i]["odaProName"] == null?"":printList[i]["odaProName"];
                    odaPartPrint = printList[i]["odaPart"] == null?"":printList[i]["odaPart"];
                    contractNoPrint = printList[i]["contractNo"] == null?"":printList[i]["contractNo"];
                    odaIfFinishedProductPrint = printList[i]["odaIfFinishedProductName"]
                    odaMakingPiecesStatusPrint = printList[i]["odaMakingPiecesStatus"];
                    odaCaseNoPrint = printList[i]["odaCaseNo"] == null?"":printList[i]["odaCaseNo"];
                    odaBoxingDatePrint = printList[i]["odaBoxingDate"] == null?"":printList[i]["odaBoxingDate"];
                    //odaWhiIdName = printList[i]["odaWhiIdName"];
                    odaPositionPrint = printList[i]["odaPosition"] == null?"":printList[i]["odaPosition"];
                    odaStorageDatePrint = printList[i]["odaStorageDate"];
                    odaRemarkPrint = printList[i]["odaRemark"] == null?"":printList[i]["odaRemark"];

                    newRow = "<tr><td style='border-left:1px solid;border-top:1px solid'>" + rowIndex + "</td>" +
                        "<td style='border-left:1px solid;border-top:1px solid'>" + odaMatNamePrint + "</td>" +
                        "<td style='border-left:1px solid;border-top:1px solid'>" + odaDrawingCodePrint + "</td>" +
                        "<td style='border-left:1px solid;border-top:1px solid'>" + odaNumPrint + "</td>" +
                        "<td style='border-left:1px solid;border-top:1px solid'>" + odaUnitPrint + "</td> \n" +
                        "<td style='border-left:1px solid;border-top:1px solid'>" + odaProCodePrint + "</td>" +
                        "<td style='border-left:1px solid;border-top:1px solid'>" + odaProNamePrint + "</td>" +
                        "<td style='border-left:1px solid;border-top:1px solid'>" + odaPartPrint + "</td>" +
                        "<td style='border-left:1px solid;border-top:1px solid'>" + contractNoPrint + "</td>" +
                        "<td style='border-left:1px solid;border-top:1px solid'>" + odaIfFinishedProductPrint + "</td>" +
                        "<td style='border-left:1px solid;border-top:1px solid'>" + odaMakingPiecesStatusPrint + "</td>" +
                        "<td style='border-left:1px solid;border-top:1px solid'>" + odaCaseNoPrint + "</td>" +
                        "<td style='border-left:1px solid;border-top:1px solid'>" + odaBoxingDatePrint + "</td>" +
                        //"<td style='border-left:1px solid;border-top:1px solid'>" + odaWhiIdName + "</td>" +
                        "<td style='border-left:1px solid;border-top:1px solid'>" + odaPositionPrint + "</td>" +
                        "<td style='border-left:1px solid;border-top:1px solid'>" + odaStorageDatePrint + "</td>" +
                        "<td style='border-left:1px solid;border-top:1px solid'>" + odaRemarkPrint + "</td></tr>";
                    $("#myTb").append(newRow);

                }
                $("#printArea").printArea();
                $("#printArea").hide();
            }
        });
    }
    $(function () {

        js.get({
            url: ctx + "half/halWarManage/inAndOutQuery/getInFinish",
            data: {odrId: $('#odrId').val()},
            success: function (result) {
                js.hot.init({
                    element: document.getElementById('hot'),
                    data: result.data,
                    formData: ["odrOutType", "odrSummary", "odrChecker", "odrDept", "odrServicePerson"],
                    colHeaders: ['ID', '库存数量', '库存ID', '物料描述', '图号', '数量', '单位', '项目编号', '项目名称', '部分名称','合同编号', '是否成品', '存放状态', '箱号', '装箱日期', '区位', '出库日期', '备注'],
                    fieldName: ['odaId', 'odaAvaNum', 'ityId', 'odaMatName', 'odaDrawingCode', 'odaNum', 'odaUnit', 'odaProCode', 'odaProName', 'odaPart','contractNo', 'odaIfFinishedProductName', 'odaMakingPiecesStatus', 'odaCaseNo', 'odaBoxingDate',  'odaPosition', 'odaStorageDate', 'odaRemark'],
                    height: 590,
                    correctFormat: true,
                    minSpareRows: 100,
                    hiddenColumns: {
                        columns: [0, 1, 2],
                        indicators: true
                    },
                    columns: [
                        {
                            data: 'odaId',
                            type: 'numeric',
                            width: 40
                        },
                        {
                            data: 'odaAvaNum',
                            type: 'numeric',
                            readOnly: true

                        },
                        {
                            data: 'ityId',
                            type: 'numeric',
                            readOnly: true
                        },
                        {
                            data: 'odaMatName',//物料描述
                            type: 'text',
                            readOnly: true
                        },
                        {
                            data: 'odaDrawingCode',//图号
                            type: 'text',
                            readOnly: true
                        },
                        {
                            data: 'odaNum',//数量
                            type: 'numeric',
                            readOnly: true
                        },
                        {
                            data: 'odaUnit',//单位
                            type: 'text',
                            readOnly: true
                        },
                        {
                            data: 'odaProCode',//项目编号
                            type: 'text',
                            readOnly: true
                        },
                        {
                            data: 'odaProName',//项目名称
                            type: 'text',
                            readOnly: true
                        },
                        {
                            data: 'odaPart',//部分名称
                            type: 'text',
                            readOnly: true
                        },
                        {
                            data: 'contractNo',//合同编号
                            type: 'text',
                            readOnly: true
                        },
                        {
                            data: 'odaIfFinishedProductName',//是否成品
                            type: 'text',
                            readOnly: true
                        },
                        {
                            data: 'odaMakingPiecesStatus',//存放状态
                            type: 'text',
                            readOnly: true
                        },

                        {
                            data: 'odaCaseNo',//箱号
                            type: 'text',
                            readOnly: true
                        },
                        {
                            data: 'odaBoxingDate',//装箱日期
                            type: 'text',
                            readOnly: true
                        },
                        {
                            data: 'odaPosition',//区位
                            type: 'text',
                            readOnly: true
                        },
                        {
                            data: 'odaStorageDate',//出库日期
                            type: 'date',
                            dateFormat: 'YYYY-MM-DD',
                            correctFormat: true,
                            readOnly: true
                        },
                        {
                            data: 'odaRemark',//备注
                            type: 'text',
                            readOnly: true
                        }
                    ]
                });
            }
        })

        // 绑定打印明细数据
        function printInBillDetail(id) {

            $("#printArea").show();
            js.post({
                url: ctx + "half/halWarManage/outOfFinishWar/printDetailList",
                data: {
                    id: id
                },
                contentType: "application/x-www-form-urlencoded",
                success: function (data) {
                    var printList = data.data;
                    // 添加dataTable表头
                    $("#table-box").empty();
                    $("#table-box").append('<table id="inBillTable"\n' +
                        '               style="font-size: 12px;text-align: center;border-right:1px solid;border-bottom:1px solid; border-collapse: collapse;"\n' +
                        '               width="100%"\n' +
                        '               cellspacing="0" cellpadding="1">\n' +
                        '        </table>');
                    $("#inBillTable").append('<THEAD style="display:table-header-group;">\n' +
                        '<TR><td style="border-left: 1px solid;border-top: 1px solid;">序号</td>' +
                        '<td style="border-left: 1px solid;border-top: 1px solid;">物料描述</td>' +
                        '<td style="border-left: 1px solid;border-top: 1px solid;">图号</td>' +
                        '<td style="border-left: 1px solid;border-top: 1px solid;">数量</td>' +
                        '<td style="border-left: 1px solid;border-top: 1px solid;">单位</td>' +
                        '<td style="border-left: 1px solid;border-top: 1px solid;">项目编号</td>' +
                        '<td style="border-left: 1px solid;border-top: 1px solid;">项目名称</td>' +
                        '<td style="border-left: 1px solid;border-top: 1px solid;">部分名称</td>' +
                        '<td style="border-left: 1px solid;border-top: 1px solid;">是否成品</td>' +
                        '<td style="border-left: 1px solid;border-top: 1px solid;">存放状态</td>' +
                        '<td style="border-left: 1px solid;border-top: 1px solid;">箱号</td>' +
                        '<td style="border-left: 1px solid;border-top: 1px solid;">装箱日期</td>' +
                        '<td style="border-left: 1px solid;border-top: 1px solid;">库房</td>' +
                        '<td style="border-left: 1px solid;border-top: 1px solid;">存放位置</td>' +
                        '<td style="border-left: 1px solid;border-top: 1px solid;">出库日期</td>' +
                        '<td style="border-left: 1px solid;border-top: 1px solid;">备注</td></TR>\n ' +
                        '</THEAD> ');
                    $("#inBillTable").append('<tbody id="myTb"> </tbody>');
                    // 循环绑定dataTable行数据
                    var rowIndex;
                    var odaMatNamePrint;
                    var odaDrawingCodePrint;
                    var odaNumPrint;
                    var odaUnitPrint;
                    var odaProCodePrint;
                    var odaProNamePrint;
                    var odaPartPrint;
                    var odaIfFinishedProductPrint;
                    var odaMakingPiecesStatusPrint;
                    var odaCaseNoPrint;
                    var odaBoxingDatePrint;
                    var odaWhiIdName;
                    var odaPositionPrint;
                    var odaStorageDatePrint;
                    var odaRemarkPrint;

                    var newRow;

                    for (i = 0; i < printList.length; i++) {
                        rowIndex = printList[i]["rowIndex"];
                        odaMatNamePrint = printList[i]["odaMatName"];
                        odaDrawingCodePrint = printList[i]["odaDrawingCode"];
                        odaNumPrint = printList[i]["odaNum"];
                        odaUnitPrint = printList[i]["odaUnit"];
                        odaProCodePrint = printList[i]["odaProCode"];
                        odaProNamePrint = printList[i]["odaProName"];
                        odaPartPrint = printList[i]["odaPart"];
                        odaIfFinishedProductPrint = printList[i]["odaIfFinishedProductName"]
                        odaMakingPiecesStatusPrint = printList[i]["odaMakingPiecesStatus"];
                        odaCaseNoPrint = printList[i]["odaCaseNo"];
                        odaBoxingDatePrint = printList[i]["odaBoxingDate"];
                        odaWhiIdName = "成品库";
                        odaPositionPrint = printList[i]["odaPosition"];
                        odaStorageDatePrint = printList[i]["odaStorageDate"];
                        odaRemarkPrint = printList[i]["odaRemark"];

                        newRow = "<tr><td style='border-left:1px solid;border-top:1px solid'>" + rowIndex + "</td>" +
                            "<td style='border-left:1px solid;border-top:1px solid'>" + odaMatNamePrint + "</td>" +
                            "<td style='border-left:1px solid;border-top:1px solid'>" + odaDrawingCodePrint + "</td>" +
                            "<td style='border-left:1px solid;border-top:1px solid'>" + odaNumPrint + "</td>" +
                            "<td style='border-left:1px solid;border-top:1px solid'>" + odaUnitPrint + "</td> \n" +
                            "<td style='border-left:1px solid;border-top:1px solid'>" + odaProCodePrint + "</td>" +
                            "<td style='border-left:1px solid;border-top:1px solid'>" + odaProNamePrint + "</td>" +
                            "<td style='border-left:1px solid;border-top:1px solid'>" + odaPartPrint + "</td>" +
                            "<td style='border-left:1px solid;border-top:1px solid'>" + odaIfFinishedProductPrint + "</td>" +
                            "<td style='border-left:1px solid;border-top:1px solid'>" + odaMakingPiecesStatusPrint + "</td>" +
                            "<td style='border-left:1px solid;border-top:1px solid'>" + odaCaseNoPrint + "</td>" +
                            "<td style='border-left:1px solid;border-top:1px solid'>" + odaBoxingDatePrint + "</td>" +
                            "<td style='border-left:1px solid;border-top:1px solid'>" + odaWhiIdName + "</td>" +
                            "<td style='border-left:1px solid;border-top:1px solid'>" + odaPositionPrint + "</td>" +
                            "<td style='border-left:1px solid;border-top:1px solid'>" + odaStorageDatePrint + "</td>" +
                            "<td style='border-left:1px solid;border-top:1px solid'>" + odaRemarkPrint + "</td></tr>";
                        $("#myTb").append(newRow);

                    }
                    $("#printArea").printArea();
                    $("#printArea").hide();
                }
            });
        }

    });
</script>
</body>
</html>